<!DOCTYPE html>
<html>

<head>
    <meta content="telephone=no" name="format-detection">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Language" content="zh-CN">
    <meta http-equiv="x-ua-compatible" content="IE=edge, chrome=1">
    <meta name="viewport"
        content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <meta name="keywords" content="关键词" />
    <meta name="description" content="页面简介" />
    <link rel="icon" href="favicon.ico" />
    <link rel="shortcut icon" href="favicon.ico" />
    <link href="csaa/css/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="./csaa/fonts/iconfont/iconfont.css">
    <link rel="stylesheet" href="./csaa/fonts/materialicons/material-icons.css">

    <script language="javascript" type="text/javascript" src="./csaa/js/jquery.min.js"></script>
    <script src="./csaa/js/httpPath.js"></script>
    <script src="./csaa/js/httpUtils.js"></script>
    <script language="javascript" type="text/javascript" src="./csaa/js/site.js"></script>
    <script language="javascript" type="text/javascript" src="./csaa/js/html2canvas.js"></script>
    <title>全国青少年航空科学素质等级考试</title>
</head>

<body class="register" style="background-color: #efefef;">
    <!-- 头部 开始 -->
    <div class="header query_header">

    </div>
    <!-- 头部 结束 -->




    <!-- 主体 开始 -->
    <div id="ticket_main">
        <div class="query_content limitwidth">

            <div class="query_box">
                <div class="part_title">我的准考证</div>
                <div class="query_info">
                    <div class="info_item">

                        <div class="cert_info">
                            <div id="qianduanwz" class="cert_box">
                                <img src="./csaa/img/zhunkao.jpg" class="img">
                                <div class="title_con">全国青少年无人机科学素质等级考试</div>
                                <div class="list_part">
                                    <div class="item_part">
                                        <div class="st_img img_wrap">
                                            <div class="img" style=""></div>
                                        </div>
                                        <!-- <div class="item"> -->
                                        <!-- <div class="label">时间</div> -->
                                        <!-- <div class="text cert_time">--</div> -->
                                        <!-- </div> -->
                                    </div>

                                    <div class="item_part">
                                        <div class="item">
                                            <div class="label">姓名</div>
                                            <div class="text big_font name">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">性别</div>
                                            <div class="text cert_sex">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">场次名称</div>
                                            <div class="text times_name">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">身份证号</div>
                                            <div class="text idnum">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">准考证号</div>
                                            <div class="text ticketCode">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">考场名称</div>
                                            <div class="text companyName">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">考场地址</div>
                                            <div class="text address">--</div>
                                        </div>
                                        <div class="item">
                                            <div class="label">考试时间</div>
                                            <div class="text date">--</div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="manage_btnwrap">
                            <div class="closebtn btn">返回>></div>
                            <a href="" class="btn btn_color_1 btn_download" download="准考证">下载准考证</a>
                        </div>


                    </div>

                </div>
            </div>

        </div>
        <div class="footer">@ 全国青少年无人机科学素质等级考试</div>

    </div>
    <!-- 主体 结束 -->

    <script>
        getQueryString();
        var get_timesId = getQueryString("timesId");
        var get_orderId = getQueryString("orderId");


        // var tmp_parms = {
        //     "id": 22, //序号
        //     "timesId": 9, //场次
        //     "userId": localStorage.getItem("userId"),
        //     "token": localStorage.getItem("token")
        // };

        var tmp_parms = {
            "id": get_orderId, //序号
            "timesId": get_timesId, //场次
            "userId": localStorage.getItem("userId"),
            //"userId": "194",
            "token": localStorage.getItem("token")
        };
        fun_getticket();
        function fun_getticket(){
            $.ajax({
                type: "POST",
                url: GET_RECORD,
                dataType: "json",
                data: tmp_parms,
                async: false,
                timeout: 20000,
                success: function (data, textStatus) {
                    if (typeof data != "object") {
                        data = $.parseJSON(data);
                    }
                    //console.log(data)
                    if (data.status == 1) {
                        var $tmp_html = $("<div/>");
                        var fetch_data = data.data;
                        //没有更多内容了
                        if (fetch_data.length == 0) {
                            $(".cert_box").html("<div class=\"nothing\"></div>");
                            return false;
                        }
                        //$(".img_wrap .img").css("background-image", 'url(' + fetch_data.user.userImage + ')');
                        $(".img_wrap .img").attr("data-lazybgimg", fetch_data.user.userImage);
                        $(".name").text(fetch_data.user.name);
                        $(".idnum").text(fetch_data.user.idNum);
                        $(".ticketCode").text(fetch_data.admissionTicket.ticketCode);

                        if (fetch_data.user.sex == 0) {
                            $(".cert_sex").text("女");
                        } else {
                            $(".cert_sex").text("男");
                        }
                        // $.each(fetch_data.examinationPoint, function(i, n) {
                        //     $(".times_name").text(n.companyName);
                        // })

                        $(".times_name").text(fetch_data.examinationTimes.timesName);
                        $(".companyName").text(fetch_data.admissionTicket.examinationPoint.companyName);

                        //截取【companyAddress】 【&&】 后字符
                        var tmp_str = fetch_data.admissionTicket.examinationPoint.companyAddress;
                        var index = tmp_str.lastIndexOf("&");
                        tmp_str = tmp_str.substring(index + 1, tmp_str.length)
                        $(".address").text(fetch_data.admissionTicket.examinationPoint.province.name + fetch_data.admissionTicket.examinationPoint.city.name + fetch_data.admissionTicket.examinationPoint.area.name + tmp_str);

                        $(".date").text(toDateStrh(fetch_data.examinationTimes.startDate) +"至"+ toDateStrh(fetch_data.examinationTimes.endDate));

                    } else {
                        $.fn.winktips(data.msg);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    $.fn.winktips("连接超时，请检查您的网络");
                }
            });
        };

        //合成图片下载
        setTimeout(function(){
            new html2canvas(document.getElementById('qianduanwz'), {
                // backgroundColor: "transparent",
                allowTaint: true,
                useCORS: true,
            }).then(canvas => {
                // canvas为转换后的Canvas对象
                let oImg = new Image();
                oImg.src = canvas.toDataURL(); // 导出图片
                document.body.appendChild(oImg).style.display = "none"; // 将生成的图片添加到body

                $(".btn_download").attr("href", oImg.src)


            });
        }, 500);

        $(".closebtn").on("click", function(){
            console.log(121321)
            window.opener = null;
            window.open('', '_self', '');
            window.close();
        });

        function toDateStrh(timestamp) {
            var date = new Date(timestamp); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
            var Y = date.getFullYear() + '-';
            var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
            var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
            return Y + M + D;
        }
    </script>
</body>

</html>
